<#setting classic_compatible=true>
<#assign base=request.contextPath />
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- Meta, title, CSS, favicons, etc. -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="icon" href="../images/favicon.ico" type="image/ico" />
    <title>服务接入</title>
    <!-- 引入通用css和js -->
	<#include "/common/commoncss.ftl">
    <link rel="stylesheet" type="text/css" href="${base}/zhgl-jzstyxx-manage/css/queue/serviceAccess.css">
  </head>
<body class="nav-md">
<!-- 配置发送方式 -->
  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
      <div class="modal-dialog">
           <div class="modal-content">
                <div class="modal-header" style="padding:8px">
                      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                            &times;
                        </button>
                        <h4 class="modal-title" id="myModalLabel">
                            	发送方式
                        </h4>
                    </div>
                    <div id="" class="modal-body"style="text-align:center;;">
                        <form id="myform" class=" form-horizontal">
                        </form>
                        <button type="button" class="btn btn-primary save" style="background: #3B9ED9;"onclick="saveSend(this)">保存
		                </button>
		               <button type="button" class="btn btn-primary back"   style="background: #38924D;" data-dismiss="modal">返回
		               </button>
                    </div>
                </div>
            </div>
        </div>
<!-- 发送方式 -->
<script id="sendTypeTemplate" type="text/html">
<%for(var i = 0; i<send.length; i++) {%>
	<%if(list!=""&&list!=null){%>
		<%if(list.sendType==send[i].dictCode){%>
			<option value="<%:=send[i].dictCode%>,<%:=send[i].dictName%>"selected><%:=send[i].dictName%></option>
		<%}else{%>
			<option value="<%:=send[i].dictCode%>,<%:=send[i].dictName%>"><%:=send[i].dictName%></option>
		<%}%>
	<%}else{%>
			<option value="<%:=send[i].dictCode%>,<%:=send[i].dictName%>"><%:=send[i].dictName%></option>
		<%}%>
<%}%>
</script>
<!-- 发送配置 -->
<script id="sendTemplate" type="text/html">
	<input id="num"name="num"value=""type="hidden"/>
	<div class="form-group">
        <label for="sendType" class="col-sm-2 control-label mylabel"style="width: 20%;">发送方式:</label>
        <div class="col-sm-4 col-sm-me">
            	<select id="sendType"name="sendType"class="form-control"onchange=clicks(this.value)>
				</select>
        </div>
    </div>
    <div class="form-group" id="channel">
        <label for="sendChannel" class="col-sm-2 control-label mylabel"style="width: 20%;">发送通道:</label>
        <div class="col-sm-4 col-sm-me"name="sendChannel">
            <textarea type="text" class="form-control" name="sendChannel"id="sendChannel" placeholder="请输入url" 
              style="max-width:405.75px;height:100px;max-height:400px;"value="<%:=send.sendChannel%>"></textarea>
        </div>

		<label class="col-sm-2 control-label mylabel"style="width: 20%;"></label>
		<div id="sendURL" class="col-sm-4 col-sm-me">
			<button  type="button" class="btn btn-primary"style="background: ##3B9ED9;float: left;" onclick="sendUrl()">点击进行通道测试
	    	</button>
		</div>
	</div>


    <div class="form-group" id="mail" style="display:none;">
        <label for="sendChannel" class="col-sm-2 control-label mylabel"style="width: 20%;">邮箱配置:</label>
        <div class="col-sm-4 col-sm-me">
            <textarea type="text" class="form-control" name="sendConfig" id="sendConfig" 
              style="max-width:405.75px;height:100px;max-height:400px;"value="<%:=send.sendChannel%>"></textarea>
        </div>
	</div>
</script>
<!-- 页面部分 -->
       	<div class="body-content" style="padding-top: 1%;">
				<div>
					<p><i class="iconfont icon-zhuti"></i>&nbsp;&nbsp;主题队列管理&nbsp;<i class="glyphicon glyphicon-chevron-right"></i>&nbsp;
						<#if map.edit??>
							修改服务接入
        				<#else>
							新增服务接入
						</#if>
					</p>
				</div>
	       		<div style="width: 100%;">
					<div class="panel panel-default" >
						<!-- 内容 -->
						<div class="panel-body"style="min-height:450px;">
			            	<form  id="serviceAccess" class=" form-horizontal">
				                <div class="form-group">
				                    <label for="queueName" class="col-sm-2 control-label" style="width: 110px;">主题队列名称</label>
				                    <div class="col-sm-4">
				                    <input class="form-control inputbox" id="topicServiceName"onblur="saveServiceName()" name="topicServiceName"value="${map.ServiceName!}"maxlength="32"placeholder="请输入主题队列名称"
					                    	   onkeyup="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')" 
			                                    onpaste="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')" 
			                                   oncontextmenu = "value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')">
				                    	<!-- <#if map.status="1302">
				                    		<input class="form-control inputbox" id="topicServiceName"onchange="saveServiceName()" name="topicServiceName"value="${map.ServiceName!}"maxlength="64"disabled="disabled" >
				        				<#else> 
					                    	<input class="form-control inputbox" id="topicServiceName"onchange="saveServiceName()" name="topicServiceName"value="${map.ServiceName!}"maxlength="64"placeholder="请输入主题队列名称"
					                    	   onkeyup="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')" 
			                                    onpaste="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')" 
			                                   oncontextmenu = "value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')">
										 </#if> -->
				                    	<!-- <input class="form-control inputbox" id="topicServiceName"onchange="saveServiceName()" name="topicServiceName"value="${map.ServiceName!}"maxlength="64"placeholder="请输入主题队列名称" > -->
				                    </div>
				                </div>
	            			</form>
	            			<div style="height:15px;"></div>
	            			<!-- 链条图 -->
	            			<div class="chain">
		            			<div class="chainContent">
		            				<div style="position: relative;width:44%;float: left;">
			            				<!-- 源应用 -->
			            				<div class="appConf" style="float: left;width:25%;">
		            						<p style="">源应用配置</p>
			            					<#if map.origin.originName??>
							                	<div style="width: 100%; ">
			            							<img src="${base}/zhgl-jzstyxx-manage/images/queueIcon/selectSystem_site.png" class="icon" aria-hidden="true">
							                	</div>
					            				<button type="button" class="btn iconBtn" style="background: #1C76B4;" onclick="checkOriginApp()" value="${map.origin.originId!}">
								                    	${map.origin.originName!}
								                </button>
			            					<#else>
							                	<div style="width: 100%; ">
			            							<img src="${base}/zhgl-jzstyxx-manage/images/queueIcon/selectSystem_gray.png" class="icon" aria-hidden="true">
							                	</div>
					            				<button type="button" class="btn iconBtn" onclick="checkOriginApp()">
								                    	选择应用系统
								                </button>
								            </#if>
			            				</div>
			            				<!-- 虚线 -->
			            				<div class="oneLine" style="width: 50%;">
						                	<hr class="hrs"></hr>
						                </div>
			            				<!-- 队列 -->
			            				<div class="appConf" style="float: left;width:25%;">
			            						<#if map.template.templateName??>
			            						<div class="appConf" style="float: left;width:85%;">
			            							<p style="">消息模板配置</p>
			            							<div style="width: 100%; ">
					            						<img id="templateimg"src="${base}/zhgl-jzstyxx-manage/images/queueIcon/selectNews_site.png" class="icon" aria-hidden="true">
			            							</div>
			            							<button id="templatebutton" type="button" class="btn iconBtn" style="background: #1C76B4;"onclick="checktemple()">
										                    	${map.template.templateName!}
										            </button>
										        </div>
										        <div style="width:15%;float:right;">
									            		<img height="20px;" width="20px;"src="${base}/zhgl-jzstyxx-manage/images/red-del.png" alt="删除"onclick="removeTemplate()"/>
									            </div>
										         <#else>
										         <div class="appConf" style="width:100%;">
			            							<p style="">消息模板配置</p>
										         	<div style="width: 100%; ">
					            						<img src="${base}/zhgl-jzstyxx-manage/images/queueIcon/selectNews_site.png" class="icon" aria-hidden="true">
			            							</div>
			            							<button type="button" class="btn iconBtn"  style="background: #1C76B4;"onclick="checktemple()">
										                    	空模板
										            </button>
										          </div>
										         </#if>
			            				</div>
		            				</div>
		            				<div style="position: relative;width:55%;float: right;">
		            					<!-- 虚线 -->
		            					<div style="position: relative;width:30%;float: left;">
			            					<!-- 长水平虚线（右框） -->
						                	<hr class="hrs" style="margin-top: 65px;"></hr>
						                	<!-- 增加多条组合虚线 -->
						                	<div class="imageLines" id="dasheds" style="position: relative;width:50%;float: right;">
						                	<#assign n =1 />
		            							<#if targetNum?? && (targetNum gt 1) >
				            						<#list targetList as item>
				            						<#assign n = n+1 />
				            								<div class="hrsVerDiv" id="hrs${n}">
				            									<hr class="hrsVertical"></hr>
				            								</div>
				            								<hr class="shortHrs"id="hrss${n}"></hr>
				            						</#list>
				            					</#if>
						                	</div>
		            					</div>
		            					<!-- 目标应用配置  -->
		            					<div style="position: relative;width:70%;float: right;">
				            				<!-- 目标应用配置1 -->
				            			<div id="sends1" style="min-height:251px;">
					            				<div class="appConf"style="width:35%;float:left;">
			            							<p >消息发送配置</p>
			            							<#if firstApp.sendName??>
									                	 <div style="width: 100%; ">
					            							<img  id="imgx" src="${base}/zhgl-jzstyxx-manage/images/queueIcon/send_blue.png" class="icon" aria-hidden="true">										
					            						</div>
							            				<button id="sendx" type="button" class="btn iconBtn" style="background: #1C76B4;"onclick="send(1,${firstApp.status!})">
									                    	${firstApp.sendName!}
										                </button> 
										               <#else>
											               <div style="width: 100%; ">
						            							<img id="img1"  src="${base}/zhgl-jzstyxx-manage/images/queueIcon/send_gray.png" class="icon" aria-hidden="true">										
						            						</div>
								            				<button id="send1" type="button" class="btn iconBtn" onclick="send(1,1)">
										                    	配置发送方式
											                </button>
											            </#if>
					            				</div>
					            				<div style="width:20%;float:left;">
					            						<hr class="hrs" style="margin-top: 65px;"></hr>
					            				</div>
					            				<div class="appConf"style="width:35%;float:left;">
			            							<#if firstApp.targetName??>
			            							<div class="appConf"style="width:85%;float:left;">
			            								<p >目标应用配置</p>
									                	<div style="width: 100%; ">
					            							<img id="appx" src="${base}/zhgl-jzstyxx-manage/images/queueIcon/selectSystem_site.png" class="icon" aria-hidden="true">
									                	</div>
							            				<button id="appxs" type="button" class="btn iconBtn" style="background: #1C76B4;" onclick="checkTargetApp(1,${firstApp.status!})"">
										                    	${firstApp.targetName!}
										                </button>
										             </div>
										             <div class="delTar"style="width:15%;float:right;">
									            		<img height="20px;" width="20px;"src="${base}/zhgl-jzstyxx-manage/images/red-del.png" alt="删除" onclick="delTarApp(1)"/>
									           		 </div>
					            					<#else>
					            					<div class="appConf"style="width:85%;float:left;">
			            								<p >目标应用配置</p>
									                	<div style="width: 100%; ">
					            							<img  src="${base}/zhgl-jzstyxx-manage/images/queueIcon/selectSystem_gray.png" class="icon" aria-hidden="true">										
					            						</div>
							            				<button  type="button" class="btn iconBtn" onclick="checkTargetApp(1,1)">
									                    	选择应用系统
										                </button>
										             </div>
										             <div class="delTar"style="width:15%;float:right;">
									            		<img height="20px;" width="20px;"src="${base}/zhgl-jzstyxx-manage/images/red-del.png" alt="删除" onclick="delTarApp(1)"/>
									           		 </div>
										            </#if>
					            				</div>
				            				</div>
				            				<!-- 目标应用配置集合 -->
				            			 	<div id="targetAppList">
				            			 	<#assign n =1 />
		            							<#if targetNum??>
				            						<#list targetList as item>
				            							<#assign n = n+1 />
				            							<div id="sends${n}"style="min-height: 226px;">
				            							<div class="appConf"style="width:35%;float:left;">
				            							<#if item.sendName??>
								                	 		<div style="width: 100%; ">
				            										<img  src="${base}/zhgl-jzstyxx-manage/images/queueIcon/send_blue.png" class="icon" aria-hidden="true">										
				            								</div>
						            						<button id="send${n}" type="button" class="btn iconBtn" style="background: #1C76B4;"onclick="send(${n},${item.status!})">
								                    				${item.sendName!}
									                		</button> 
									              		 <#else>
										              		 <div style="width: 100%; ">
					            									<img id="img${n}"  src="${base}/zhgl-jzstyxx-manage/images/queueIcon/send_gray.png" class="icon" aria-hidden="true">										
					            							 </div>
							            					 <button id="send${n}" type="button" class="btn iconBtn" onclick="send(${n},1)">
									                    		配置发送方式
										               		 </button>
										            	</#if>
										            	</div>
														<div style="width:20%;float:left;">
								            						<hr class="hrs" style="margin-top: 37px;"></hr>
								            			</div>
								            			<div class="appConf"style="width:35%;float:left;">
												                <#if item.targetName??>
												                <div class="appConf"style="width:85%;float:left;">
												                	<div style="width: 100%; ">
								            							<img src="${base}/zhgl-jzstyxx-manage/images/queueIcon/selectSystem_site.png" class="icon" aria-hidden="true">
												                	</div>
										            				<button type="button" class="btn iconBtn" style="background: #1C76B4;" onclick="checkTargetApp(${n},${item.status!})">
													                    	${item.targetName!}
													                </button>
													             </div>
													             <div class="delTar"style="width:10%;float:right;">
								            						<img height="20px;" width="20px;" src="${base}/zhgl-jzstyxx-manage/images/red-del.png" alt="删除" onclick="delTarApp('${(n)!}')"/>
								            					 </div>
								            					<#else>
								            					<div class="appConf"style="width:85%;float:left;">
												                	<div style="width: 100%; ">
								            							<img  src="${base}/zhgl-jzstyxx-manage/images/queueIcon/selectSystem_gray.png" class="icon" aria-hidden="true">										
								            						</div>
										            				<button  type="button" class="btn iconBtn" onclick="checkTargetApp(${n},1)">
												                    	选择应用系统
													                </button>
													             </div>
													             <div class="delTar"style="width:10%;float:right;">
								            						<img height="20px;" width="20px;" src="${base}/zhgl-jzstyxx-manage/images/red-del.png" alt="删除" onclick="delTarApp('${(n)!}')"/>
								            					</div>
													            </#if>
								            				</div>
								            			</div>
								            		</#list>
				            					</#if>
				            				</div> 
						                	<!-- 新增目标应用 -->
				            				<div class="appConf appItem"style="width:35%">
				            					<button type="button" class="btn iconBtn" style="background: #673ab7;" onclick="addTargetApp()">
				            						<span class="iconfont icon-add" aria-hidden="true"></span>
				            						新增目标应用
								                </button>
						                	</div>
		            					</div>
		            				</div>
		            			</div>
	            			</div>
						</div>
						<div class="panel-footer" style="background: #fff;text-align: center;">
			                <button type="button" class="btn btn-default save" onclick="save()"
			                	style="background: #3B9ED9;color: #fff;">保存
			                </button>
			                <button type="button" class="btn btn-default back" onclick="backQueue()"
			                	style="background: #3E8F4D;color: #fff;">返回
			                </button>
						</div>
					</div>
	       		</div>
		</div>
	<#include "/common/commonjs.ftl">
	<script type="text/javascript" src="/zhgl-jzstyxx-manage/js/template.js"></script>
	<script type="text/javascript" src="/zhgl-jzstyxx-manage/js/jquery.serializejson.min.js"></script>
	<script type="text/javascript" src="${base}/zhgl-jzstyxx-manage/js/queue/serviceAccess.js"></script>
	<script type="text/javascript" src="${base}/zhgl-jzstyxx-manage/js/jquery.validate.min.js"></script>
	<script type="text/javascript">
		var key = "${key!}";
		var targetNum = "${targetNum!}";
		var id = "${id!}";
		var sendHost="${sendHost!}"
		var status = "${status!}";
	</script>
  </body>
  </html>